<!DOCTYPE>
<html lang="zh-cn">
	<head>
  		<meta charset="utf-8">
      	<meta http-equiv="X-UA-Compatible" content="IE=edge">
      	<link rel="shortcut icon" href="favicon.ico"/>
      	<title>店铺街 - {$CONF['mallTitle']}</title>
      	<meta name="keywords" content="{$CONF['mallKeywords']}" />
      	<meta name="description" content="{$CONF['mallDesc']},切换城市" />
      	<link rel="stylesheet" href="__ROOT__/Apps/Home/View/default/css/common.css" />
     	<link rel="stylesheet" href="__ROOT__/Apps/Home/View/default/css/base.css" />
		<link rel="stylesheet" href="__ROOT__/Apps/Home/View/default/css/head.css" />
   	</head>
   	<body>
		<include file="./Apps/Home/View/default/header_common.html" />

		<!----加载商品楼层start----->
		<div class="wst-container">
			<div class="wst-shadow">
				<div class="other-main">
            <div class="hot-cities">
                <h2>进入<a href="javascript:;" onclick="changeCity({$area['areaId']});">{$area["areaName"]}</a></h2>
                <div class="shortcut">
                
                    <span>按省份选择：</span>
                    <div class="shortcut-select shortcut-select-p">
                        <select id="provinceId" onchange="getCitys(this);">
                        	<volist name="provinceList" key="k" id="province">
                        	<option <if condition="$province['areaId'] eq $area['parentId']">selected</if> value="{$province['areaId']}">{$province["areaName"]}</option>
                        	</volist>
                        </select>
                    </div>
                    <div class="shortcut-select shortcut-select-city">
                        <select id="cityId">
                        	<option>选择城市</option>
                        </select>
                    </div>    
                    <input type="button" class="button" value="确 定" onclick="changeCity();">
                </div>
                
            </div>
            <div class="citys-listbox">
                <div class="select-py">
                    <span>按拼音首字母选择：</span>
                    <a href="javascript:void(0);" onclick="letter_scroll('A')">A</a><a href="javascript:void(0);" onclick="letter_scroll('B')">B</a><a href="javascript:void(0);" onclick="letter_scroll('C')">C</a><a href="javascript:void(0);" onclick="letter_scroll('D')">D</a><a href="javascript:void(0);" onclick="letter_scroll('E')">E</a><a href="javascript:void(0);" onclick="letter_scroll('F')">F</a><a href="javascript:void(0);" onclick="letter_scroll('G')">G</a><a href="javascript:void(0);" onclick="letter_scroll('H')">H</a><a href="javascript:void(0);" onclick="letter_scroll('I')">I</a><a href="javascript:void(0);" onclick="letter_scroll('J')">J</a><a href="javascript:void(0);" onclick="letter_scroll('K')">K</a><a href="javascript:void(0);" onclick="letter_scroll('L')">L</a><a href="javascript:void(0);" onclick="letter_scroll('M')">M</a><a href="javascript:void(0);" onclick="letter_scroll('N')">N</a><a href="javascript:void(0);" onclick="letter_scroll('O')">O</a><a href="javascript:void(0);" onclick="letter_scroll('P')">P</a><a href="javascript:void(0);" onclick="letter_scroll('Q')">Q</a><a href="javascript:void(0);" onclick="letter_scroll('R')">R</a><a href="javascript:void(0);" onclick="letter_scroll('S')">S</a><a href="javascript:void(0);" onclick="letter_scroll('T')">T</a><a href="javascript:void(0);" onclick="letter_scroll('U')">U</a><a href="javascript:void(0);" onclick="letter_scroll('V')">V</a><a href="javascript:void(0);" onclick="letter_scroll('W')">W</a><a href="javascript:void(0);" onclick="letter_scroll('X')">X</a><a href="javascript:void(0);" onclick="letter_scroll('Y')">Y</a><a href="javascript:void(0);" onclick="letter_scroll('Z')">Z</a>                </div>
            <div class="citys-list">
           		<foreach name="cityList" item="citys" key="k">
           		<dl id="c_{$k}" onmouseover="$(this).addClass('hover')" onmouseout="$(this).removeClass('hover')" class="">
                    <dt>{$k}</dt>
                    <dd>
                    	<volist name="citys" key="k2" id="city">
                    	<a href="javascript:;" onclick="changeCity({$city['areaId']});">{$city["areaName"]}</a>
                    	</volist>          
                  	</dd>
                </dl>
                </foreach> 
            </div>
        </div>
        </div>
			</div>
		</div>
		<include file="./Apps/Home/View/default/footer.html" />
		<include file="./Apps/Home/View/default/right_cart.html" />
   	</body>
   	
   	<script src="__ROOT__/Apps/Home/View/default/js/shopstreet.js"></script>
	<script src="__PUBLIC__/js/common.js"></script>
	<script src="__ROOT__/Apps/Home/View/default/js/head.js" type="text/javascript"></script>
	<script src="__ROOT__/Apps/Home/View/default/js/common.js" type="text/javascript"></script>

	<script type="text/javascript">
	    var changecity_cityinfo;
	    var cities = new Array();
	    var city_pinyins = new Array();
	    var city_first_chart=[["a","b","c","d"],["e","f","g","h","i","j"],["k","l","m","n"],["o","p","q","r","s","t"],["u","v","w","x","y","z"]];
	    $(document).ready(function () {
	    	getCitys();
	    	$(window).unbind('scroll');
	    });
	    function getCitys(){
	    	var provinceId = $("#provinceId").val();
	    	jQuery.post("{:U('Home/Areas/getCityListByProvince/')}",{provinceId:provinceId},function(rsp) {
	    		var json = WST.toJson(rsp);
	    		var citys = new Array();
	    		
	    		for(var i=0;i<json.length;i++){
	    			var city = json[i];
	    			if(city.areaId==WST.CITY_ID){
	    				citys.push("<option value='"+city.areaId+"' selected>"+city.areaName+"</option>");
	    			}else{
	    				citys.push("<option value='"+city.areaId+"'>"+city.areaName+"</option>");
	    			}
	    		}
	    		if(!json.length){
	    			citys.push("<option>选择城市</option>");
	    		}
	    		$("#cityId").html(citys.join(""));
	    	});
	    }
	    
	    
	    /**
	    * 字母页面内链
	    */
	    function letter_scroll(letter) {
	        var obj = $("#c_" + letter);
	        if(obj && obj.offset()){
	       		$('html,body').animate({ scrollTop: obj.offset().top }, 500);
	        }
	    }
	
	</script>
	   	
</html> 
